<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
	window.onload = function() {
		//根据id进行选择
		var selById = document.getElementById("title");
		
		//根据name进行选择
		var selByName = document.getElementsByName("loves")[0];
		
		//根据class进行选择
		var selByClass = document.getElementsByClassName("first")[0];
		
		//css选择器
		//document.querySelector()    : 根据css选择器规则，返回第一个匹配的元素
		//document.querySelectorAll() : 根据css选择器规则，返回第所有匹配的元素
		var ps = document.querySelector("#p1");
		var pc = document.querySelectorAll(".classp");
	}
</script>
</head>
<body>
	<p id="title">可爱的中国</p>
	<span class="first">我来自中国的一个小山村，那里有美丽的山和水</span>
	<p name="loves">我的爱好：</p>
	<ul>
		<li>苹果
		<li>雪梨
		<li>香蕉
	</ul>
	<div id="div1">
        <p id="p1" class="classp">我是第一个P</p>
        <p id="p2" class="classp">我是第二个P</p>
    </div>
</body>
</html>